<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>极客开发者</title>
    <link rel="stylesheet" href="./css/bootstrap.min.css">
    <link rel="stylesheet" href="./css/main.css">
</head>
<body>
<div class="navbar navbar-default">
    <div class="container">
        <div class="navbar-header">
            <a href="index.ftl" class="navbar-brand"></a>
        </div>
        <!-- class="visible-xs-inline-block"：在超小屏幕上显示-->
        <label for="toggle-checkbox" id="toggle-label" class="visible-xs-inline-block">菜单</label>
        <input type="checkbox" class="hidden" id="toggle-checkbox">
        <div class="hidden-xs">
            <ul class="nav navbar-nav">
                <li class="${(tid==0)?string("active","")}"><a href="all_news?flag=0&typeId=0">首页</a></li>
                <#list allType as at>
                    <li class="${(tid==at.typeId)?string("active","")}"><a href="all_news?flag=1&typeId=${at.typeId}" >${at.typeName}</a></li>
                </#list>
            </ul>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="login.html">登陆</a></li>
                <li><a href="signup.html">注册</a></li>
            </ul>
        </div>
    </div>
</div>
<div class="container">
    <div class="row">
        <div class="col-sm-2">
            <div class="list-group side-bar hidden-xs">
                <#list categoryList as cl>
                    <a href="all_news?flag=2&categoryId=${cl.categoryId}&typeId=${tid}" class="list-group-item ${(cid==cl.categoryId)?string("active","")}">${cl.categoryName}</a>
                </#list>
            </div>
        </div>

        <div class="col-sm-7">
            <div class="news-list">
                <#list allNews as an>
                    <div class="news-list-item clearfix">
                        <div class="col-xs-5">
                            <img src="img/${an.img}">
                        </div>
                        <div class="col-xs-7">
                            <a href="get_news?newsId=${an.newsId}" class="title">${an.newsName}</a>
                            <div class="info">
                                <span class="avatar"><img src="img/logo.png"></span>
                                <span>${an.readNum}</span>•
                                <span>${an.commentNum}评论</span>•
                                <span>${an.timeAgo}</span>
                            </div>
                        </div>
                    </div>
                </#list>
            </div>
        </div>

        <div class="col-sm-3">
            <div class="search-bar">
                <input type="search" class="form-control" placeholder="搜一下">
            </div>
            <div class="side-bar-card flag clearfix">
                <div class="col-xs-5">
                    <img src="img/1-1.png">
                </div>
                <div class="col-xs-7">
                    <div class="text-lg">有害信息举报专区</div>
                    <div>举报电话：12377</div>
                </div>
            </div>
            <div class="side-bar-card">
                <div class="card-title">24小时热闻</div>
                <div class="card-body">
                    <div class="list">
                        <#list hotNews as hn>
                            <div class="item">
                                <a class="title" href="/get_news?newsId=${hn.newsId}">${hn.newsName}</a>
                                <div class="desc">${hn.readNum}阅读　1k评论</div>
                            </div>
                        </#list>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="footer">
    Copyright © 2017 jkdev.cn | 极客开发者2017版
</div>
</body>
</html>